<?php

use app\assets\ApiAsset;
use app\assets\EchartsAsset;
use app\assets\LayerAsset;
use app\assets\TableAsset;
use app\models\KeyMap;
use yii\helpers\Html;

/**
 * @var $this yii\web\View
 * @var $isp app\models\Isp
 * @var $amount integer
 * @var $statusCount array 状态数量统计
 */

ApiAsset::register($this);
EchartsAsset::register($this);
LayerAsset::register($this);
TableAsset::register($this);

$this->title = '运营商统计';
$this->params['breadcrumbs'][] = '卡管理';
$this->params['breadcrumbs'][] = $this->title;
?>
<table class="table table-striped table-bordered table-hover">
    <tr>
        <th colspan="2"><h4>基本信息</h4></th>
    </tr>
    <tr>
        <th width="100">编号</th>
        <td><?php echo $isp->id;?></td>
    </tr>
    <tr>
        <th>名称</th>
        <td><?php echo Html::encode($isp->name);?></td>
    </tr>
    <tr>
        <th>接口</th>
        <td><?php echo Html::encode($isp->api->name);?></td>
    </tr>
    <tr>
        <th>状态</th>
        <td><?php echo KeyMap::getValue('isp_status', $isp->status);?></td>
    </tr>
    <tr>
        <th>创建时间</th>
        <td><?php echo Yii::$app->formatter->asDatetime($isp->create_time);?></td>
    </tr>
    <tr>
        <th colspan="2"><h4>卡统计</h4></th>
    </tr>
    <tr>
        <th>总数量</th>
        <td><?php echo $amount;?></td>
    </tr>
    <tr>
        <th>卡状态</th>
        <td>
            <div id="charts_cardStatus" style="min-height:400px;"></div>
            <script>
                function showCardStatus() {
                    var option = {
                        tooltip: {
                            trigger: 'item',
                            formatter: "{a} <br/>{b}: {c} ({d}%)"
                        },
                        legend: {
                            orient: 'vertical',
                            x: 'left',
                            data:<?php echo json_encode(array_keys($statusCount));?>
                        },
                        series: [
                            {
                                name:'卡状态',
                                type:'pie',
                                radius: ['50%', '70%'],
                                avoidLabelOverlap: false,
                                data: <?php echo json_encode(array_map(function ($status, $value) {
                                    return [
                                        'name' => $status,
                                        'value' => $value,
                                    ];
                                }, array_keys($statusCount), array_values($statusCount)));?>
                            }
                        ]
                    };

                    var chartsCardStatus = echarts.init(document.getElementById('charts_cardStatus'));
                    chartsCardStatus.setOption(option);
                }
            </script>
        </td>
    </tr>
</table>
<script>
    function pageInit() {
        showCardStatus();
    }
</script>
